<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Stock Up!</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <link href="./css/bootstrap.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }
    </style>
    <link href="./css/bootstrap-theme.css" rel="stylesheet">
	<link href="./css/custom.css" rel="stylesheet">

    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="../assets/js/html5shiv.js"></script>
    <![endif]-->
	<link rel="apple-touch-icon-precomposed" sizes="144x144" href="./ico/growth.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="./ico/growth114.png">
      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="./ico/growth72.png">
                    <link rel="apple-touch-icon-precomposed" href="./ico/growth57.png">
                                   <link rel="shortcut icon" href="./ico/growth32.png">
  </head>

  <body>

    <nav class="navbar navbar-fixed-top navbar-inverse">
      <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#headernavbar">
            <span class="sr-only">Toggle Navigation</span>
			<span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">Stock Up</a>
	  </div>
      
	  <div class="navbar-collapse collapse" id="headernavbar">
		<ul class="nav navbar-nav">
		  <li class="dropdown active">
			<a href="#" class="dropdown-toggle" data-toggle="dropdown">Home<b class="caret"></b></a>
			<ul class="dropdown-menu">
			  <li class="dropdown-submenu"><a tabindex="-1" href="#">Games</a>
				<ul class="dropdown-menu">
					<li><a href="#">Eastern Time Zone Free-For-All</a></li>
					<li><a href="#">Day Traders Unite!</a></li>
					<li><a href="#">Don't Lose Your Shirt...</a></li>
				</ul>
			  </li>
			  <li><a href="#">Join Game</a></li>
			  <li><a href="#">New Game</a></li>
			  <li class="divider"></li>
			  <li class="nav-header">Friends</li>
			  <li><a href="#">Invite Friends</a></li>
			  <li><a href="#">Add Friends</a></li>
			  <li><a href="#">Manage Friends</a></li>
			  <li><a href="#">Send Message</a></li>
			</ul>
		  </li>
		  <li><a href="#contact">Stock Analysis</a></li>
		  <li class="dropdown"><a href="#contact" class="dropdown-toggle" data-toggle="dropdown">Leaderboards<b class="caret"></b></a>
			<ul class="dropdown-menu"> 
				<li><a href="#">Global</a></li>
				<li class="divider"></li>
				<li><a href="#">Eastern Time Zone Free-For-All</a></li>
				<li><a href="#">Day Traders Unite!</a></li>
				<li><a href="#">Don't Lose Your Shirt...</a></li>
			</ul>
		  </li>
		</ul>
		<ul class="nav navbar-nav navbar-right">
		  <li class="dropdown">
			<a href="#" class="dropdown-toggle" data-toggle="dropdown">Username<b class="caret"></b></a>
			<ul class="dropdown-menu">
			  <li><a href="#">Profile</a></li>
			  <li class="divider"></li>
			  <li><a href="#">Sign Out</a></li>
			</ul>
		  </li>
		</ul>
	  </div><!--/.nav-collapse -->
    </nav>

    <div class="container">

      <!-- Main hero unit for a primary marketing message or call to action -->
      <div class="jumbotron">
		<img src="../../assets/images/growth.png" class="pull-right"></img>
		<h1>Stock-Up!</h1>
        <p>Message of the Day: Welcome to Stock-Up! The exciting game that leverages real stock information.<br /><br />Buy! Sell! Humiliate your friends and neighbors!</p>
        <p><a href="#" class="btn btn-primary btn-large">Invite Friends &raquo;</a></p>
      </div>

      <!-- Example row of columns -->

	<div class="col-xs-12 col-md-4 list-group">
		<h2>Active Games</h2>
		<div class="list-group">
			<a href="#" class="list-group-item"><span class="list-group-item-text">Eastern Time Zone Free-For-All</span><span class="list-group-item-text pull-right currency gain">1435.54</span></tr></table></a>
			<a href="#" class="list-group-item"><span class="list-group-item-text">Day Traders Unite!</span><span class="list-group-item-text pull-right currency loss">712.75</span></tr></table></a>
			<a href="#" class="list-group-item"><span class="list-group-item-text">Don't Lose Your Shirt...</span><span class="list-group-item-text pull-right currency gain">10785.12</span></tr></table></a>
		</div>
		<h4>Completed Games</h4>
		<div class="list-group">
			<a href="#" class="list-group-item"><span class="list-group-item-text">One Day Rush!</span><span class="list-group-item-text pull-right currency nochange">875.44</span></a>
			<a href="#" class="list-group-item"><span class="list-group-item-text">October 1929</span><span class="list-group-item-text pull-right currency nochange">987.75</span></a>
		</div>
		<a class="btn" href="#">New Game &raquo;</a><a class="btn" href="#">Join Game &raquo;</a>
	</div>
	<div class="col-xs-12 col-md-4">
	  <h2>Quick Stock Watch</h2>
	  <div class="list-group sixitems">
		  <li><table class="quickquote"><tr><td class="stocksymbol"><a href="#">LCC</a></td><td class="stockprice gain">$20.15</td></tr></table></li>
		  <li><table class="quickquote"><tr><td class="stocksymbol"><a href="#">AAMRQ</a></td><td class="stockprice loss">$9.00</td></tr></table></li>
		  <li><table class="quickquote"><tr><td class="stocksymbol"><a href="#">GOOG</a></td><td class="stockprice loss">$1027.33</td></tr></table></li>
		  <li><table class="quickquote"><tr><td class="stocksymbol"><a href="#">APPL</a></td><td class="stockprice gain">$803.42</td></tr></table></li>
		  <li><table class="quickquote"><tr><td class="stocksymbol"><a href="#">MU</a></td><td class="stockprice gain">$17.80</td></tr></table></li>
		  <li><table class="quickquote"><tr><td class="stocksymbol"><a href="#">CREE</a></td><td class="stockprice loss">$55.43</td></tr></table></li>
	  </ul>
	  <table><tr><td><a class="btn" href="#">Add Symbol &raquo;</a></td><td><a class="btn" href="#">Remove Symbol &raquo;</a></td></tr></table>
   </div>
	<div class="col-xs-12 col-md-4">
	  <h2>Friends</h2>
	  <div class="list-group sixitems">
		  <li><table class="friendrow"><tr><td class="user"><a href="#">Billy Bob Jones</a></td><td class="friendstatus">Active</td></tr></table></li>
		  <li><table class="friendrow"><tr><td class="user"><a href="#">Warren Buffet</a></td><td class="friendstatus">Offline: 1 day</td></tr></table></li>
		  <li><table class="friendrow"><tr><td class="user"><a href="#">John Rockefeller</a></td><td class="friendstatus">Offline: 7 hours</td></tr></table></li>
		  <li><table class="friendrow"><tr><td class="user"><a href="#">Bill Gates</a></td><td class="friendstatus">Offline: 3 days</td></tr></table></li>
	  </div>
	<table><tr><td><a class="btn" href="#">Add Friend &raquo;</a></td><td><a class="btn" href="#">Invite Friend &raquo;</a></td></tr></table>
	</div>


      <hr>

      <footer>
        <p>&copy; The Sith Lords 2013</p>
      </footer>

    </div> <!-- /container -->

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
	<script src="./js/jquery.js"></script>
    <script src="./js/bootstrap.js"></script>
    
  </body>
</html>
